<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>过滤器</title>
  </head>
  <body>
    <div ng-app="myApp" ng-controller="personCtrl">
      姓名：{{ name | uppercase }}
      <p>使用过滤器，改为大写输出</p>
      <input type="text" ng-model="msg" />
      <p>倒序输出：{{ msg | reverse }}</p>
    </div>
    <script src="../lib/angular.1.7.8.js"></script>
    <script>
      var app = angular.module('myApp', [])
      app.controller('personCtrl', $scope => {
        console.log('TCL: $scope', $scope)
        $scope.name = 'WangDaZhui'
        $scope.msg = 'abcdef'
      })
      // 自定义过滤器
      app.filter('reverse', function() {
        //可以注入依赖
        return function(text) {
          return text
            .split('')
            .reverse()
            .join('')
        }
      })
    </script>
  </body>
</html>
